<template>
    <div class="hot-recom">
        <h1 class='hot-title'>周末热玩</h1>
        <div class="hot-week" v-for="(item,index) of weekList" :key="index">
            <div class="hot-week-site">
                <img class="week-img" :src="item.imgUrl" alt="">
                <p class="week-line">{{item.weekLine}}</p>
                <p class="week-info">{{item.weekInfo}}</p>
                <a class="week-detail" href="#">查看详情</a>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    name:'HomeWeek',
    props:{
        weekList:Array
    },
    data(){
        return{
            
        }
    }
}
</script>
<style lang="stylus" scoped>
    .hot-recom
        margin-top:.5rem
        min-height:0
        overflow :auto
        padding-bottom:50%
        .hot-title
            font-size :.38rem
            text-align :center
            
        .hot-week
            width:100%
            min-height :4.5rem
            overflow :hidden
            margin-top:.2rem
            .hot-week-site
                margin:.2rem 0
                .week-img
                    width:100%
                    height:3rem
                .week-line
                    width :95%
                    font-size :.32rem
                    padding:.2rem .2rem 0
                    overflow :hidden
                    white-space :nowrap
                    text-overflow :ellipsis
                .week-info
                    width :100%
                    font-size :.2rem
                    padding:.1rem .2rem
                    overflow :hidden
                    white-space :nowrap
                    text-overflow :ellipsis
                .week-detail
                    font-size :.3rem
                    color:#ff8300
                    padding:.1rem .2rem
</style>
